// Learn TypeScript:
//  - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/typescript.html
//  - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/typescript.html
// Learn Attribute:
//  - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/reference/attributes.html
//  - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/reference/attributes.html
// Learn life-cycle callbacks:
//  - [Chinese] https://docs.cocos.com/creator/manual/zh/scripting/life-cycle-callbacks.html
//  - [English] http://www.cocos2d-x.org/docs/creator/manual/en/scripting/life-cycle-callbacks.html

const { ccclass, property } = cc._decorator;

@ccclass
export default class DragComponent extends cc.Component {

    @property(cc.Node)
    dragNode: cc.Node = null;

    @property
    type: number = 0;

    private bIsHit: boolean;
    private bIsMoving: boolean;
    private bIsCanDrag: boolean;
    private orginPos: cc.Vec2;

    onLoad() {
        this.bIsHit = false;
        this.bIsMoving = false;
        this.bIsCanDrag = true;

        this.orginPos = this.dragNode.position;
    }
    onEnable(){
        this.node.on(cc.Node.EventType.TOUCH_START, this.touchStart.bind(this));
        // this.node.parent.on(cc.Node.EventType.TOUCH_END, this.touchEnd.bind(this));
        this.node.parent.on(cc.Node.EventType.TOUCH_END, this.touchEnd.bind(this));
        this.node.parent.on(cc.Node.EventType.TOUCH_CANCEL, this.touchEnd.bind(this));
    }

    onDisable(){
        this.node.off(cc.Node.EventType.TOUCH_START, this.touchStart.bind(this));
        
        // this.node.off(cc.Node.EventType.TOUCH_END, this.touchEnd.bind(this));
        this.node.parent.off(cc.Node.EventType.TOUCH_END, this.touchEnd.bind(this));
        this.node.parent.off(cc.Node.EventType.TOUCH_CANCEL, this.touchEnd.bind(this));
        this.node.off(cc.Node.EventType.TOUCH_MOVE, this.touchMoved.bind(this))
    }

    start() {

    }

    setIsCanDrag(isCanDrag) {
        this.bIsCanDrag = isCanDrag;
    }

    private _touchTimeout: number = -1;
    touchStart(event) {
        var pos = this.node.convertToNodeSpaceAR(event.getLocation());
        var box = this.dragNode.getBoundingBox();
        if (pos.x >= box.x && pos.x <= box.x + box.width && pos.y >= box.y && pos.y <= box.y + box.height) {
            this.bIsHit = true;
            this.node.on(cc.Node.EventType.TOUCH_MOVE, this.touchMoved.bind(this));
            this._touchTimeout = Date.now();
        }
        this.dragNode.scale = 1.2;
        return false;
    }

    touchMoved(event) {
        if (!this.bIsHit) {
            return;
        }

        if (!this.bIsCanDrag) {
            return false;
        }
        
        var touchpos = this.node.convertToNodeSpaceAR(event.getLocation());
        touchpos = touchpos.add(new cc.Vec2(0,60))
        if (!this.bIsMoving) {
            if(touchpos.sub(this.orginPos).mag() < 100){ //如果是内圈移动不处理
                return;
            }
            this.bIsMoving = true;
            this.setDirtyFlag(true);
        } else {
        }

        this.node.emit("touch_move", { type: this.type, pos: touchpos });
    }

    touchEnd(event) {
        this.node.off(cc.Node.EventType.TOUCH_MOVE, this.touchMoved.bind(this))
        
        if (!this.bIsHit) {
            return;
        }
        this.bIsHit = false;

        if(Date.now() - this._touchTimeout < 100 || !this.bIsMoving){
            this.node.emit("touch_end", { isShortClick: true });
            return;
        }

        if (!this.bIsMoving) {
            // this.node.emit("touch_end", this.type);
            return;
        }

        this.dragNode.scale = 1;

        this.bIsMoving = false;

        this.setDirtyFlag(false);

        let isShortClick: boolean = false;
        const pos = this.node.convertToNodeSpaceAR(event.getLocation());
        this.node.emit("touch_end", { type: this.type, pos: pos, isShortClick: isShortClick });
    }

    public resetPos() {
        this.dragNode.scale = 1;
        this.dragNode.position = this.orginPos;
    }

    setDirtyFlag(dirtyFlag) {
        var children = this.node.children;
        for (var i = 0; i < children.length; i++) {
            var child = children[i];
            if (child) {
                // child.setMyChangedDirtyFlag(dirtyFlag);
            }
        }
    }

}
